
//搜索框组件
//使用示例: container: 当前的'.searchbar', callback带有参数query(input value),点击搜索按钮时触发
//  myApp.searchbar('.searchbar', function(query){
//      console.log('keywords: ' + query)
//  })

var Searchbar = function (container, callback, params) {
    var defaults = {
        input: null,
        clearButton: null,
        searchButton: null,
        submitButton: null,
        overlay: null,
        /* Callbacks
         onSearch
         onEnable
         onDisable
         onClear
         */
    };
    params = params || {};
    for (var def in defaults) {
        if (typeof params[def] === 'undefined' || params[def] === null) {
            params[def] = defaults[def];
        }
    }

    // Instance
    var s = this;

    // Material
    s.material = myApp.params.material;

    // Params
    s.params = params;

    // Container
    container = $$(container);
    s.container = container;

    // Active
    s.active = false;

    // Input
    s.input = s.params.input ? $$(s.params.input) : s.container.find('input[type="search"]');
    s.clearButton = s.params.clearButton ? $$(s.params.clearButton) : s.container.find('.searchbar-clear');
    s.submitButton = s.params.submitButton ? $(s.params.submitButton) : s.container.find('.searchbar-submit');

    // Is In Page
    s.pageContainer = s.container.parents('.page').eq(0);

    // Overlay
    if (!s.params.overlay) {
        s.overlay = s.pageContainer.length > 0 ? s.pageContainer.find('.searchbar-overlay') : $$('.searchbar-overlay');
    }
    else {
        s.overlay = $$(s.params.overlay);
    }

    // Trigger
    s.triggerEvent = function (eventName, callbackName, eventData) {
        s.container.trigger(eventName, eventData);
    };

    // Enable/disalbe
    s.enable = function (e) {
        function _enable() {
            if (!s.container.hasClass('searchbar-active') && !s.query) s.overlay.addClass('searchbar-overlay-active');
            s.container.addClass('searchbar-active');
            s.triggerEvent('enableSearch', 'onEnable');
            s.active = true;
        }
        if (myApp.device.ios && !myApp.params.material && e && e.type === 'focus') {
            setTimeout(function () {
                _enable();
            }, 400);
        }
        else {
            _enable();
        }
    };

    s.disable = function () {
        s.input.val('').trigger('change');
        s.container.removeClass('searchbar-active searchbar-not-empty');

        s.overlay.removeClass('searchbar-overlay-active');

        s.active = false;
        function _disable() {
            s.input.blur();
        }
        if (myApp.device.ios) {
            setTimeout(function () {
                _disable();
            }, 400);
        }
        else {
            _disable();
        }
        s.triggerEvent('disableSearch', 'onDisable');
    };

    // Clear
    s.clear = function (e) {
        if (!s.query && e && $$(e.target).hasClass('searchbar-clear')) {
            s.disable();
            return;
        }
        s.input.val('').trigger('change').focus();
        s.triggerEvent('clearSearch', 'onClear');
    };

    // Search
    s.handleInput = function () {
        setTimeout(function () {
            var value = s.input.val().trim();
            s.query = value; //input value
            if (value.length === 0) {
                s.container.removeClass('searchbar-not-empty');
            }
            else {
                s.container.addClass('searchbar-not-empty');
            }
        }, 0);
    };


    //Submit Results
    s.submit = function() {
        if (callback && s.query != '') {
            //新增修复ios9以下版本输入法获取问题 
            s.query = s.input.val().trim();
            callback(s.query);
        }
    }

    // Events
    function preventSubmit(e) {
        e.preventDefault();
    }

    s.attachEvents = function (destroy) {
        var method = destroy ? 'off' : 'on';
        s.container[method]('submit', preventSubmit);
        s.submitButton[method]('click', s.submit);
        s.overlay[method]('click', s.disable);
        s.input[method]('focus', s.enable);
        s.input[method]('change keydown keypress keyup', s.handleInput);
        s.clearButton[method]('click', s.clear);

    };
    s.detachEvents = function() {
        s.attachEvents(true);
    };

    // Init Destroy
    s.init = function () {
        s.attachEvents();
    };
    s.destroy = function () {
        if (!s) return;
        s.detachEvents();
        s = null;
    };

    // Init
    s.init();

    return s;

};
myApp.searchbar = function (container, callback, params) {
    return new Searchbar(container, callback, params);
};
myApp.initSearchbar = function (container, callback) {
    container = $$(container);
    var searchbar = container.hasClass('searchbar') ? container : container.find('.searchbar');
    if (searchbar.length === 0) return;

    //if (!searchbar.hasClass('searchbar-init')) return;
    var sb = myApp.searchbar(searchbar, callback, searchbar.dataset());


    function onBeforeRemove() {
        if (sb) sb.destroy();
    }
    if (container.hasClass('page')) {
        container.once('pageBeforeRemove', onBeforeRemove);
    }
    else if (container.hasClass('navbar-inner')) {
        container.once('navbarBeforeRemove', onBeforeRemove);
    }
};
